<template>
    <div class="myAddress">
      <van-radio-group v-model="radio" @change="onChange">
        <van-radio :name="i"  v-for="(v,i) in list" :key="i" @click="chooseAddress(v)" checked-color="#ff4c50">
          <p class="name">{{v.name}}, <span class="tel">{{v.tel}}</span></p>
          <p class="address">{{v.address}}</p>
          <img class="write" src="/static/img/write.png" alt="">
        </van-radio>
      </van-radio-group>
      <div class="address">
      </div>
    </div>
</template>

<script>
  import request from "@/actions/request.js"
  export default {
    name: "address",
    props:["list","type"],
    data(){
      return{
        radio:0,
        addressList:[]
      }
    },
    methods:{
      onChange(act){
        let index = act.mp.detail;
        this.radio = index;
      },
      chooseAddress(item){
        if(this.type == 1){
          request.setDefaultAddress('api/user/setDefaultAddress','post',{
            address_id:item.id
          },{},true,this)
          wx.setStorageSync("address",item)
        }else{

        }
      }
    },
    mounted(){
      /*this.addressList = JSON.stringify(list)*/
    }
  };
</script>

<style scoped>
.myAddress{
  padding-left:2vw;
}
.name{
  font-size: 14px;
  color: #333;
  line-height:3vw;
}
.tel{
  color: #666;
  font-size: 13px;
}
.address{
  font-size: 13px;
  color: #666;
  max-width:80vw;
}
.write{
  width:4vw;
  height:4vw;
  float:right;
  position:relative;
}
</style>
<style lang="scss">
  .myAddress{
    van-radio-group{
      width:100vw;
      height:auto;
      maxheight:80vh;
      overflow:scroll;
    }
    van-radio{
      padding: 2vw;
      display:block;
      height:10vw !important;
      border-bottom:1px solid #ccc;
      padding-top:4vw;
    }
  }
</style>
